import Picker from 'better-picker';
import {
	yearInit, 
	getMonths, 
	getMdays, 
	getTime, 
	checkTime
} from './mytimes';

/*
 * domId：点击触发的dom id
 * self：this对象
 * target：目标变量
 * */
export default (domId,self,target) => {
	let city = yearInit();//源数据
	var nameEl = document.getElementById(domId);
	var first = []; 
	var second = []; 
	var third = [];
	
	var curMonth = new Date().getMonth();
	var curDay = new Date().getDate();
	var selectedIndex = [20, curMonth, curDay-1]; /* 默认选中的 */
	var checked = [20,curMonth, curDay-1]; /* 已选选项 */
	
	function creatList(obj, list) {
		obj.forEach(function(item, index, arr) {
			var temp = new Object();
			temp.text = item.name;
			temp.value = index;
			list.push(temp);
		})
	}
	
	creatList(city, first);
	
	if(city[selectedIndex[0]].hasOwnProperty('sub')) {
		creatList(city[selectedIndex[0]].sub, second);
	} else {
		second = [{ text: '', value: 0 }];
	}
	
	if(city[selectedIndex[0]].sub[selectedIndex[1]].hasOwnProperty('sub')) {
		creatList(city[selectedIndex[0]].sub[selectedIndex[1]].sub, third);
	} else {
		third = [{ text: '', value: 0 }];
	}
	
	var picker = new Picker({
		data: [first, second, third],
		selectedIndex: selectedIndex,
		title: '选择日期'
	});
	
	picker.on('picker.select', function(selectedVal, selectedIndex) {
		var text1 = first[selectedIndex[0]].text;
		var text2 = second[selectedIndex[1]].text;
		var text3 = third[selectedIndex[2]] ? third[selectedIndex[2]].text : '';
		/*console.log(JSON.stringify(getTime(selectedIndex)));//保留获取方式2*/
		self.$set(self.$data,target,`${text1}.${text2}.${text3}`);
	});
	
	picker.on('picker.change', function(index, selectedIndex) {
		checked[index] = selectedIndex;
		checked = checkTime(checked);//修正时间数组比如2月的变化
		
		if(index === 0) {
			firstChange();
		} else if(index === 1) {
			secondChange();
		}
	
		function firstChange() {
			second = [];
			third = [];
			checked[0] = selectedIndex;
			var firstCity = city[selectedIndex];
			firstCity.sub = getMonths();
			firstCity.sub[0].sub = getMdays(firstCity.name,firstCity.sub[checked[1]].name);
			
			if(firstCity.hasOwnProperty('sub')) {
				creatList(firstCity.sub, second);
				var secondCity = city[selectedIndex].sub[0]
				if(secondCity.hasOwnProperty('sub')) {
					creatList(secondCity.sub, third);
				} else {
					third = [{ text: '', value: 0 }];
				}
			} else {
				second = [{ text: '', value: 0 }];
				third = [{ text: '', value: 0 }];
			}
	
			picker.refillColumn(1, second);
			picker.refillColumn(2, third);
			picker.scrollColumn(1, checked[1])
			picker.scrollColumn(2, checked[2])
		}
	
		function secondChange() {
			third = [];
			checked[1] = selectedIndex;
			var first_index = checked[0];
			city[first_index].sub[selectedIndex].sub = getMdays(city[first_index].name,city[first_index].sub[selectedIndex].name);
			if(city[first_index].sub[selectedIndex].hasOwnProperty('sub')) {
				var secondCity = city[first_index].sub[selectedIndex];
				creatList(secondCity.sub, third);
				picker.refillColumn(2, third);
				picker.scrollColumn(2, checked[2])
			} else {
				third = [{ text: '', value: 0 }];
				checked[2] = 0;
				picker.refillColumn(2, third);
				picker.scrollColumn(2, checked[2])
			}
		}
	});
	
	picker.on('picker.valuechange', function(selectedVal, selectedIndex) {
		//console.log(JSON.stringify(getTime(selectedIndex)));
	});
	
	nameEl.addEventListener('click', function() {
		picker.show();
	});
}
